<!DOCTYPE html>
<html lang="zh">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>My Eyes - Jayli</title>

    <!-- Bootstrap -->
    <link href="assets/bootstrap.min.css" rel="stylesheet">
    <style>
      body {
        font-family: 'Courier',"MS PGothic", "Osaka",'monospace';
      }
      .starter-template {
        margin-top:20px;
        margin-bottom:45px;
      }
      .icon-list {
        margin-top:36px;
        margin-bottom:36px;
      }
      .icon-item {
        margin:10px;
        display:inline-block;
        width:24px;
        height:24px;
      }
      .icon-item img {
        width:100%;
        height:100%;
      }
      .photo-item {
        margin-bottom: 50px;
      }
      .photo-item .des{
        margin:20px;
      }
	  .photo-item .imglink {
		display: inline-block;
	  }
      .photo-item .imglink img {
        display: block;
      }
    </style>

  </head>
  <body>
    

    <nav class="navbar navbar-static-top">
      <div class="container">
        <div id="navbar" class="navbar-collapse collapse">
          <ul class="nav navbar-nav">
            <li class="active"><a href="http://jayli.github.io/photo/">Home</a></li>
            <li><a href="http://jayli.github.io">About</a></li>
          </ul>
          <ul class="nav navbar-nav navbar-right">
			  <li>
				  <a class="jiathis_button_weixin" href="javascript:void(0);">Share</a> 
				  <script type="text/javascript" src="http://v3.jiathis.com/code/jia.js?uid=1" charset="utf-8"></script>
			  </li>
          </ul>
        </div><!--/.nav-collapse -->
      </div>
    </nav>

    <div class="container text-center">

      <div class="starter-template" >
        <!--img src="assets/logo.svg" /-->
        <img width=60 src="http://gw.alicdn.com/tps/TB1u7hjLXXXXXa2XXXXXXXXXXXX-203-165.png" />
      </div>

      <p>
		 一张照片就是人生代码的一个 tag，是记录，可回溯。
      </p>
	  <p>D7000、腾龙 SP AF 17-50mm f/2.8 XR Di II VC</p>
      <p class="icon-list">
        <a class="icon-item" href="http://jayli.github.io">
          <img src="https://gw.alicdn.com/tps/TB1X8U5JFXXXXXCXVXXXXXXXXXX-64-64.png" />
        </a>
        <a class="icon-item" href="http://github.com/jayli">
          <img src="https://gw.alicdn.com/tps/TB1P6.6JFXXXXXQXVXXXXXXXXXX-64-64.png" />
        </a>
        <a class="icon-item" href="http://www.weibo.com/jayli">
          <img src="https://gw.alicdn.com/tps/TB10gleJVXXXXcRXpXXXXXXXXXX-64-64.png" />
        </a>
        <a class="icon-item" href="https://gw.alicdn.com/tps/TB14htbIXXXXXb4XpXXXXXXXXXX.png" target=_blank>
          <img src="https://gw.alicdn.com/tps/TB1EMQ.JFXXXXbCXFXXXXXXXXXX-64-64.png" />
        </a>
      </p>
    </div><!-- /.container -->

    <div class="container text-center" id="J_PhotoListContainer">
    </div>

	<script type="text/juicer" id="J_PhotoItemTpl">
	{@each itemList as item,index}
		<div class="photo-item text-center">
			<a href="${item.img}" class="imglink">
			  <img class="center-block img-responsive" alt="Responsive image" src="${item.img}">
			</a>
			<p class="des"> ${item.des} / by <abbr title="拔赤">Jayli</abbr></p>
		</div>
	{@/each}
	</script>

    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
    <script src="assets/jquery.min.js"></script>
    <!-- Include all compiled plugins (below), or include individual files as needed -->
    <script src="assets/bootstrap.min.js"></script>
	<script src="http://g.alicdn.com/kissy/m/1.0.1/mini-min.js"></script>
    <script src="assets/juicer-min.js"></script>
    <script src="assets/lazyload.js"></script>
	<script>
		document.write("<script src='assets/data.js?t=" + KISSY.now() + "'><\/script>");
	</script>
    <script src="assets/app.js"></script>
  </body>
</html>
